<template>
  <div class="cataLists">
		<!-- 顶部搜索框 -->
	  <div class="search-bar">
        <el-form :inline="true" :model="searchParams" class="demo-form-inline">
            <el-form-item label="关键字">
                <el-input v-model="searchParams.keyWords" placeholder="关键字"></el-input>
            </el-form-item>
             <el-date-picker
                v-model="searchParams.range"
                type="datetimerange"
                :picker-options="pickerOptions"
                range-separator="至"
                start-placeholder="开始日期"
                end-placeholder="结束日期"
								format="yyyy 年 MM 月 dd 日"
                value-format="yyyy-MM-dd"
                align="right">
                </el-date-picker>
            <el-form-item>
                <el-button type="primary" @click="onSearch">查询</el-button>
            </el-form-item>
            </el-form>
    </div>
		<!-- 顶部搜索框 -->
		<!-- 分类商品 -->
		<div class="cataDisplay">
			<el-table
      :data="cataLists"
      style="width: 100%">
      <el-table-column
        prop="date"
        label="日期"
        width="180">
      </el-table-column>
      <el-table-column
        prop="name"
        label="姓名"
        width="180">
      </el-table-column>
      <el-table-column
        prop="address"
        label="地址">

      </el-table-column>
    </el-table>
		</div>
		<!-- 分类商品 -->
  </div>
</template>

<script>
import { getCataLists } from '_api'
import axios from 'axios'
export default {
  name: 'cataLists',
  data () {
    return {
      searchParams: {
        keyWords: '',
        range: [],
        cataLists: []
      }
    }
  },
  created () {
    this.getCataLists()
  },
  methods: {

    getCataLists () {
      // 请求分类列表数据
      // getCataLists().then(res => {
      //   if (res.data.code === 200) {
      //     this.cataLists = res.data.data.Lists
      //   }
      // })
      axios.get('https://console-mock.apipost.cn/app/mock/project/b86b51b5-690a-4903-94a8-15a40484f828/api/cataLists').then(res => {
        console.log(res, '88888')
      })
    },
    // 顶部搜索 查询按钮
    onSearch () {
      console.log(this.searchParams)
    }
  }
}
</script>

<style lang="scss" scoped>

</style>
